var vm = new Vue({
	el : '#vueApp',
	data : {
		keyword: '',
		list : [{"value2":"other-0","value1":"data-0","id":1}],
		pageSize : 10,
		showPages : 10,
		totalPages : 20,
		total : 0,
		curPage : 1,
		pageSizeOptions : [ 5, 10, 15, 20, 30 ]
	},
	components : {
		'pagination' : pagination,
	},
	mounted : function() {
		this.reload()
	},
	methods : {
		errorCallback:function(res) {
			alert('Background report error ')
			alert(res.status+':'+res.message)
		},
		onChange : function(ops, value) {
			if (ops == 1) {
				this.curPage = value
			} else {
				this.curPage = 1
				this.pageSize = value
			}
			this.reload();
		},
		reload : function() {
			this.findPage();
		},
		refresh : function(data) {
			console.log(data)
			this.list = data.list
			this.total = data.total
			var remainder = data.total % this.pageSize
			var pages = Math.floor(data.total / this.pageSize)
			// console.log(remainder, pages)
			this.totalPages = remainder == 0 ? pages : (pages + 1)
			if (this.totalPages <= 5) {
				this.showPages = this.totalPages
			}
			console.log(this.list)
		},
		findPage : function() {
			var query = window.location.search.substring(1);
			var pair = query.split("data=");
			console.log(pair[1]) ;
			this.$http.get(
				'/listData?pageNum=' + this.curPage + '&pageSize='
				+ this.pageSize+"&data="+pair[1]).then(function(res) {
				this.refresh(res.body)
			}, this.errorCallback);
		}
	}
})
